<template lang="html">
  <div class="">
    <div class="">
      {{this.message}}
    </div>
  </div>
</template>

<script>
import websocket from 'websocket'
export default {
  data () {
    return {
      message: 'aaa'
    }
  },
  mounted() {
    var that = this;
    var W3CWebSocket = require('websocket').w3cwebsocket;

    var client = new W3CWebSocket('ws://localhost:8080/', 'echo-protocol');

    client.onerror = function() {
        console.log('Connection Error');
    };

    client.onopen = function() {
        console.log('WebSocket Client Connected');

        function sendNumber() {
            if (client.readyState === client.OPEN) {
                var number = Math.round(Math.random() * 0xFFFFFF);
                client.send(number.toString());
            }
        }
        sendNumber();
    };

    client.onclose = function() {
        console.log('echo-protocol Client Closed');
    };

    client.onmessage = function(e) {
        if (typeof e.data === 'string') {
          that.message = that.message + e.data
        }
    };
  }
}
</script>

<style lang="css">
  circle {

  }
</style>
